import React, { PureComponent } from 'react';
import { connect } from 'dva';
import { FormInstance } from 'antd/lib/form';
import { Modal, Button, message, Input, Select, InputNumber } from 'antd';
import { Form } from '@ant-design/compatible';
import { transferOption } from "@/utils/common";
import { findDicByCodeSort } from "@/support/common";
import PropTypes from "prop-types";

const FormItem = Form.Item;
@connect()
@Form.create({
    mapPropsToFields(props) {
        const formDataEdit = Object.assign({}, props.formData);
        for (const i in formDataEdit) {
            if(i === "platform" && formDataEdit[i]){
                formDataEdit[i]=Form.createFormField({value:formDataEdit[i] + ""});
            } else {
                formDataEdit[i]= Form.createFormField({value:formDataEdit[i]});
            }
        }
        return formDataEdit;
    },
})
export default class SmsModal extends PureComponent<any, any> {

    static contextTypes = {
        permissions: PropTypes.array,
        dicData: PropTypes.object,
    };

    constructor(props: any) {
        super(props);
        this.state = {
            loading: false,
        };
    }

    handleSubmit = () => {
        const { form: { validateFieldsAndScroll }, dispatch, formData, handleFlush} = this.props;
        validateFieldsAndScroll((err: any, values: any) => {
            if (err) return;
            const data = {...values};
            // 判断属于什么操作   1新增2编辑
            if(formData.smsCd){
                data.flag = 2
            } else {
                data.flag =1
            }
            this.setState({ loading: true});
            dispatch({
                type: 'messageChannel/postObjWithRes',
                payload: { url: "/message/channel/updateSms", ...data },
                callback: (response: any) => {
                    if(response.statusCode === '0') {
                        message.success( formData.smsCd ? '编辑成功': '新增成功');
                        this.handleClose();
                        handleFlush();
                    } else {
                        message.error(response.statusMessage);
                    }
                    this.setState({ loading: false});
                },
            });
        });
    };

    handleClose = () => {
        const { changeVisible } = this.props;
        const { resetFields } = this.props.form;
        resetFields();
        changeVisible();
    };

    render() {
        const { formData, visible } = this.props;
        const { getFieldDecorator } = this.props.form;
        const { loading } = this.state;
        const messageCenterSmsList = findDicByCodeSort(this.context.dicData,"messageCenterSms");
        const formItemLayout = {
            labelCol: {
                xs: { span: 24 },
                sm: { span: 8 },
            },
            wrapperCol: {
                xs: { span: 24 },
                sm: { span: 12 },
                md: { span: 16 },
            },
        };
        return (
            <Modal
                style={{ top: 20 }}
                title={formData.smsCd ? "编辑" : '新增'}
                wrapClassName="wrapModel"
                visible={visible}
                onCancel={() => this.handleClose()}
                footer={[
                    <Button size="small" key="back" type="ghost" onClick={() => this.handleClose()}>
                        取消
                    </Button>,
                    <Button size="small" key="submit" type="primary" loading={loading} onClick={() => this.handleSubmit()}>
                        保存
                    </Button>,
                ]}
            >
                <Form
                    style={{ marginTop: 12 }}
                >
                    <FormItem
                        {...formItemLayout}
                        label="短信编号"
                    >
                        {getFieldDecorator('smsCd', {
                            rules: [{ required: true, message: '短信编号不能为空！' },{message: '短信编号不能超过100位!',max:100 }],
                        })(
                            <Input disabled={!!formData.smsCd} placeholder="请输入短信编号" maxLength={100} />)
                        }
                    </FormItem>
                    <FormItem
                        {...formItemLayout}
                        label="应用名称描述"
                    >
                        {getFieldDecorator('smsDesc', {
                            rules: [{ required: true, message: '应用名描述不能为空！' },{message: '应用名描述不能超过100位!',max:100 }],
                        })(
                            <Input placeholder="请输入应用名描述" maxLength={100} />
                        )}
                    </FormItem>
                    <FormItem
                        {...formItemLayout}
                        label="应用Key"
                    >
                        {getFieldDecorator('appKey', {
                            rules: [{ required: true, message: '应用Key不能为空！' },{message: '应用Key不能超过100位!',max:100 }],
                        })(
                            <Input placeholder="请输入应用Key" maxLength={100} />
                        )}
                    </FormItem>
                    <FormItem
                        {...formItemLayout}
                        label="应用密钥"
                    >
                        {getFieldDecorator('appSecret', {
                            rules: [{ required: true, message: '应用密钥不能为空！'},{message: '应用密钥不能超过100位!',max:100 }],
                        })(
                            <Input.Password placeholder="请输入应用密钥" maxLength={100}/>
                        )}
                    </FormItem>
                    <FormItem
                        {...formItemLayout}
                        label="短信平台"
                    >
                        {getFieldDecorator('platform', {
                            rules: [{ required: true, message: '短信平台不能为空！' }],
                        })(
                            <Select
                                allowClear
                                placeholder="请选择短信平台"
                                getPopupContainer={triggerNode => triggerNode.parentNode}
                            >
                                { transferOption(messageCenterSmsList,["dictKey","dictValue"])}
                            </Select>
                        )}
                    </FormItem>
                    <FormItem
                        {...formItemLayout}
                        label="短信平台主机地址"
                    >
                        {getFieldDecorator('host', {
                            rules: [{ required: true, message: '短信平台地址不能为空！'},{message: '短信平台地址不能超过100位!',max:100 }],
                        })(
                            <Input placeholder="请输入短信平台地址" maxLength={100} />
                        )}
                    </FormItem>
                    <FormItem
                        {...formItemLayout}
                        label="短信平台服务端口"
                    >
                        {getFieldDecorator('port', {
                            rules: [{ required: true, message: '短信平台服务端口不能为空！' }],
                        })(
                            <InputNumber
                                style={{ width:"100%" }}
                                placeholder="请输入短信平台服务端口"
                                min={1}
                                max={99999}
                            />
                        )}
                    </FormItem>
                    <FormItem
                        {...formItemLayout}
                        label="短信平台通道"
                    >
                        {getFieldDecorator('channel', {
                            rules: [{ required: true, message: '短信平台通道不能为空！' },{message: '短信平台通道不能超过100位!',max:100 }],
                        })(
                            <Input placeholder="请输入短信平台通道" maxLength={100} />
                        )}
                    </FormItem>
                    <FormItem
                        {...formItemLayout}
                        label="企业代码"
                    >
                        {getFieldDecorator('corpId', {
                            rules: [{ required: false, message: '企业代码不能为空！'},{message: '企业代码不能超过100位!',max:100 }],
                        })(
                            <Input placeholder="请输入企业代码" maxLength={100} />
                        )}
                    </FormItem>
                    <FormItem
                        {...formItemLayout}
                        label="jasper key"
                    >
                        {getFieldDecorator('licenseKey', {
                            rules: [{ required: false, message: 'jasper接口使用的key不能为空' },{message: 'jasper接口使用的key不能超过100位!',max:100 }],
                        })(
                            <Input placeholder="请输入jasper接口使用的key" maxLength={100} />
                        )}
                    </FormItem>
                </Form>
            </Modal>
        );
    }
}
